<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
img {
	width: 170px;
	height: 200px;
	position:absolute;
	transition:10s;
	
}
.a{border: 2px solid black;
   width: 170px;
	height: 200px;
	position: relative;
	left: 600px;
	top: 200px;

}
.a1 {
	transform: rotateY(0) translateZ(0);
}

.a2 {
	transform: rotate(0);
}

.a3 {
	transform: rotate(0);
}

.a4 {
	transform: rotate(0);
}

.a5 {
	transform: rotate(0);
}

.a6 {
	transform: rotate(0);
}

.a7 {
	transform: rotate(0);
}

.a8 {
	transform: rotate(0);
}

.a9 {
	transform: rotate(0);
}

.a10 {
	transform: rotate(0);
}

.a11 {
	transform: rotate(0);
}

.a12 {
	transform: rotatey(0deg) translatex(0px) translatez(0px);
}

.a:HOVER .a12{
	transform: rotatey(30deg)  translatex(500px);
} 
.a:HOVER .a11{
	transform: rotatey(60deg)  translatex(500px);
} 
.a:HOVER .a10{
	transform: rotatey(90deg)  translatex(500px);
} 
.a:HOVER .a9{
	transform: rotatey(120deg)  translatex(500px);
} 
.a:HOVER .a8{
	transform: rotatey(150deg)  translatex(500px);
} 
.a:HOVER .a7{
	transform: rotatey(180deg)  translatex(500px);
} 
.a:HOVER .a6{
	transform: rotatey(210deg)  translatex(500px);
} 
.a:HOVER .a5{
	transform: rotatey(240deg)  translatex(500px);
} 
.a:HOVER .a4{
	transform: rotatey(270deg)  translatex(500px);
} 
.a:HOVER .a3{
	transform: rotatey(300deg)  translatex(500px);
} 
.a:HOVER .a2{
	transform: rotatey(330deg)  translatex(500px);
} 
.a:HOVER .a1{
	transform: rotatey(360deg)  translatex(500px);
} 
.a:HOVER {
	transform:rotatey(200deg);
} 

</style>
</head>
<body>
<div class="a">
	<img class="a1" src="01.jpg" alt="1">
	<img class="a2" src="2.jpg" alt="2">
	<img class="a3" src="3.jpg" alt="3">
	<img class="a4" src="4.jpg" alt="4">
	<img class="a5" src="5.jpg" alt="5">
	<img class="a6" src="6.jpg" alt="6">
	<img class="a7" src="7.jpg" alt="7">
	<img class="a8" src="8.jpg" alt="8">
	<img class="a9" src="9.jpg" alt="9">
	<img class="a10" src="10.jpg" alt="10">
	<img class="a11" src="11.jpg" alt="11">
	<img class="a12" src="12.jpg" alt="12">
</div>

</body>
</html>